import { VNode, ComponentPublicInstance, Ref } from "vue";
import { BreakPoint, Responsive } from "@/components/Grid/interface";

export interface EnumProps {
  label?: string; // 选项框显示的文字
  value?: string | number | boolean | any[]; // 选项框值
  disabled?: boolean; // 是否禁用此选项
  tagType?: string; // 当 tag 为 true 时，此选择会指定 tag 显示类型
  children?: EnumProps[]; // 为树形选择时，可以通过 children 属性指定子选项
  [key: string]: any;
}

export type SearchType =
  | "input"
  | "input-number"
  | "select"
  | "select-v2"
  | "tree-select"
  | "cascader"
  | "date-picker"
  | "time-picker"
  | "time-select"
  | "switch"
  | "slider";

export type SearchRenderScope = {
  searchParam: { [key: string]: any };
  placeholder: string;
  clearable: boolean;
  options: EnumProps[];
  data: EnumProps[];
};

export type SearchProps = {
  el?: SearchType; // 当前项搜索框的类型
  like?: boolean; // 输入类型时是否需要模糊查询
  label?: string; // 当前项搜索框的 label
  props?: any; // 搜索项参数，根据 element plus 官方文档来传递，该属性所有值会透传到组件
  key?: string; // 当搜索项 key 不为 prop 属性时，可通过 key 指定
  tooltip?: string; // 搜索提示
  order?: number; // 搜索项排序（从大到小）
  span?: number; // 搜索项所占用的列数，默认为 1 列
  offset?: number; // 搜索字段左侧偏移列数
  defaultValue?: string | number | boolean | any[] | Ref<any>; // 搜索项默认值
  render?: (scope: SearchRenderScope) => VNode; // 自定义搜索内容渲染（tsx语法）
} & Partial<Record<BreakPoint, Responsive>>;

export type FieldNamesProps = {
  label: string;
  value: string;
  children?: string;
};

export type RenderScope<T> = {
  row: T;
  $index: number;
  [key: string]: any;
};

export type HeaderRenderScope = {
  $index: number;
  [key: string]: any;
};

export interface ColumnProps<T = any> {
  prop: string; // 字段名
  label?: string; // 列标签
  tag?: boolean | Ref<boolean>; // 是否是标签展示
  isShow?: boolean | Ref<boolean>; // 是否显示在表格当中
  search?: SearchProps | undefined; // 搜索项配置
  enum?: EnumProps[] | Ref<EnumProps[]> | ((params?: any) => Promise<any>); // 枚举字典
  isFilterEnum?: boolean | Ref<boolean>; // 当前单元格值是否根据 enum 格式化（示例：enum 只作为搜索项数据）
  fieldNames?: FieldNamesProps; // 指定 label && value && children 的 key 值
  headerRender?: (scope: HeaderRenderScope) => VNode; // 自定义表头内容渲染（tsx语法）
  render?: (scope: RenderScope<T>) => VNode | string; // 自定义单元格内容渲染（tsx语法）
  _children?: ColumnProps<T>[]; // 多级表头
  [key: string]: any; // 其他属性
}

export interface CardProps {
  columns: ColumnProps[]; // 列配置
  requestApi: (params: any) => Promise<any>; // 请求数据的API
  cardRender?: (data: any) => VNode; // 自定义卡片渲染函数
  pagination?: boolean; // 是否需要分页，默认为true
  initParam?: any; // 初始化参数
  dataCallback?: (data: any) => any; // 处理返回的数据
  beforeSearch?: (params: any) => any; // 搜索前处理参数
  afterSearch?: (data: any) => any; // 搜索后处理数据
  searchCol?: number | Record<BreakPoint, number>; // 搜索列配置
  toolButton?: ("refresh" | "search")[] | boolean; // 是否显示工具按钮
  [key: string]: any; // 其他属性
}

// 使用更简单的类型定义，避免循环依赖
export type ProCardInstance = ComponentPublicInstance & {
  refresh: () => void;
  handleSearch: () => void;
  handleReset: () => void;
};
